{% extends 'base_head.html' %}

{% block head %}
    {% block title %}Каталог | Админка {% endblock %}
    {{ block.super }}
{% endblock %}

{% block content %}
<div class="px-0 px-lg-0">
    <div class="container text-white py-2 text-center">
        <h1 class="display-4">Shoe Inventory</h1>
    </div>
    <div class="pb-5 px-0" >
        <div class="container px-0">
            <small><a href="/admin">Back to Admin Menu</a></small>
            <div class="col-lg-12 pt-0 px-0 bg-white rounded shadow-sm mb-5">
                <div class="table-responsive px-0">
                    <div class="container text-dark py-5 px-1 text-center">
                        <p><h3 class="display-6">Current Shoe Inventory</h3></p>
                        <form action='/admin/shoe_list' method='post'>
                            {% csrf_token %}
                            <label for="model_list">Filter by Model:</label>
                            <select id="model_list" name='model_id'>
                                <option value='all'>All</option>
                                {% for model in models %}
                                <option value='{{model.id}}'>{{model.brand.name}} {{model.model}}</option>
                                {% endfor %}
                            </select><button class="btn btn-dark btn-sm">Filter</button>
                        </form>
                        <table class="table table-sm table-responsive table-striped table-hover">
                            <thead class="thead-dark">
                                <tr>
                                    <th scope="col">Бренд</th>
                                    <th scope="col">Модель</th>
                                    <th scope="col">Расцветка</th>
                                    <th scope="col">Размер</th>
                                    <th scope="col">Цена</th>
                                    <th scope="col">В наличии</th>
                                    <th scope="col">Продано</th>
                                    <th scope="col">Фото</th>
                                </tr>
                            </thead>
                            <tbody>
                                {% for shoe in shoes %}
                                <tr scope="row">
                                    <td>{{shoe.color.model.brand.name}}</td>
                                    <td>{{shoe.color.model.model}}</td>
                                    <td>{{shoe.color.color}}</td>
                                    <td>{{shoe.size}}</td>
                                    <form action='/admin/update_price' method='post'>
                                        {% csrf_token %}
                                        <td>₽{{shoe.color.model.price}}
                                            <input type='hidden' name='shoe_id' value='{{shoe.color.model.id}}'>
                                            <input type='text' name='new_price' size='5'><button class="btn btn-sm btn-dark">Update</button>
                                        </td>
                                    </form>
                                    <form action='/admin/update_desc' method='post'>
                                        {% csrf_token %}
                                        <td>{{shoe.inventory}}
                                            <input type='hidden' name='shoe_id' value='{{shoe.id}}'>
                                            <input type='text' name='new_description' size='3'><button class="btn btn-sm btn-dark">Update</button>
                                        </td>
                                    </form>
                                    <td>{{shoe.quantity_sold}}</td>
                                    <form action='/admin/update_img' method='post' enctype="multipart/form-data">
                                        {% csrf_token %}
                                        <td><img src='{{shoe.color.image.url}}' height='20px'>
                                            <input type='hidden' name='shoe_color_id' value='{{shoe.color.id}}'>
                                            <input type='file' name="new_image"><button class="btn btn-sm btn-dark">Update</button>
                                        </td>
                                    </form>
                                    
                                </tr>
                                {% endfor %}
                            </tbody>
                        </table>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
{% endblock %}